<template>
  <div style="height: 100%;">
    <el-container style="height: 100%;">
      <el-aside width="200px" style="background: pink;">
        首页
      </el-aside>
      <el-container>
        <el-header style="background: skyblue">
          <el-menu default-active="1" class="el-menu-demo" mode="horizontal">
            <el-menu-item index="1">处理中心</el-menu-item>
            <el-submenu index="2">
              <template slot="title">我的工作台</template>
              <el-menu-item index="2-1">选项1</el-menu-item>
              <el-menu-item index="2-2">选项2</el-menu-item>
              <el-menu-item index="2-3">选项3</el-menu-item>
              <el-submenu index="2-4">
                <template slot="title">选项4</template>
                <el-menu-item index="2-4-1">选项1</el-menu-item>
                <el-menu-item index="2-4-2">选项2</el-menu-item>
                <el-menu-item index="2-4-3">选项3</el-menu-item>
              </el-submenu>
            </el-submenu>
            <el-menu-item index="3" disabled>消息中心</el-menu-item>
            <el-menu-item index="4" @click="$router.push('/login')">退出</el-menu-item>
          </el-menu>
        </el-header>
        <el-main style="background: orange">
          <router-view></router-view>
        </el-main>
        <el-footer style="background: darkseagreen">
          尾部
        </el-footer>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  name: "index",

}
</script>

<style scoped>
.el-header{
  padding: 0;
}
</style>